<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="./commons/common-css.html :: commonHead('用户注册')">
	<link rel="stylesheet" th:href="@{/adminLTE/bower_components/bootstrap/dist/css/bootstrap.min.css}">
	<meta charset="UTF-8">
</head>
<body>
<div id="editMainDiv" style="padding: 10px; overflow: auto; height: 100%; width: 40%; margin-left: 30%;">
	<div class="container" style="padding: 0px;">
		<div class="row" style="padding: 20px 0;">
			<h5 style="margin-left: 3px; text-align: center; font-size: 20px;">{{title}}</h5>
		</div>
		<div class="input-control has-label-left">
			<input type="text" class="form-control" v-model="modelData.name" placeholder="">
			<label class="input-control-label-left text-right">姓名:</label>
		</div>
		<div class="input-control has-label-left" style="margin-top: 10px;">
			<input type="text" class="form-control" v-model="modelData.studentNumber" placeholder="">
			<label class="input-control-label-left text-right">学号:</label>
		</div>
		<div class="input-control has-label-left" style="margin-top: 10px;">
			<select class="form-control" v-model="modelData.facultyGuid">
				<option v-for="d in facultyList" :value="d.id">{{d.name}}</option>
			</select>
			<label class="input-control-label-left text-right">院系:</label>
		</div>
		<div class="input-control has-label-left" style="margin-top: 10px;">
			<select class="form-control" v-model="modelData.majorGuid">
				<option v-for="t in majorList" :value="t.id">{{t.name}}</option>
			</select>
			<label class="input-control-label-left text-right">专业:</label>
		</div>
		<div class="input-control has-label-left" style="margin-top: 10px;">
			<select class="form-control" v-model="modelData.sex">
				<option value="0">女</option>
				<option value="1">男</option>
			</select>
			<label class="input-control-label-left text-right">性别:</label>
		</div>
		<div class="input-control has-label-left" style="margin-top: 10px;">
			<input type="text" class="form-control" v-model="modelData.pwd" placeholder="">
			<label class="input-control-label-left text-right">密码:</label>
		</div>
		<div class="input-control has-label-left" style="margin-top: 10px;">
			<textarea class="form-control" rows="5" v-model="modelData.remarks"></textarea>
			<label class="input-control-label-left text-right">描述:</label>
		</div>
		
		<div style="text-align: center; margin-top: 10px;">
			<button type="button" @click="save" class="btn btn-success col-lg-2 col-md-2 col-lg-offset-3 col-md-offset-3">注册</button>
			<button type="button" @click="cancel" class="btn btn-warning col-lg-2 col-md-2 col-lg-offset-2 col-md-offset-2">返回登录</button>
		</div>
	</div>
</div>
<span th:include="./commons/common-js.html :: commonOnLoadJs"></span>
</body>
<script type="text/javascript" th:inline="javascript">
const id = [[${id}]],
		BASE_PATH = [[@{/}]];
const URLS = {
	PAGE_URLS: {
	},
	API_URLS: {
		SAVE: BASE_PATH+'/restful/register',
		GET_INIT: BASE_PATH+'/restful/meta/faculty/findAll'
	}
};
var reqLayerIndex = -1;
axios.interceptors.request.use(function (config) {
	reqLayerIndex = layer.load();
	return config;
}, function (error) {
	return Promise.reject(error);
});
axios.interceptors.response.use(function(response) {
	layer.close(reqLayerIndex);
	return response;
}, function (error) {
	return Promise.reject(error.response);
});
var app = new Vue({
	el: '#editMainDiv',
	data: {
		title: '新用户注册',
		modelData: {
			name: '',
			sex: 0,
			pwd: '',
			remarks: '',
			studentNumber: '',
			
			facultyName: '',
			facultyGuid: '',
			majorName: '',
			majorGuid: ''
		},
		facultyList: []
	},
	methods: {
		init: function() {
			let _this = this;
			axios.get(URLS.API_URLS.GET_INIT)
			.then(function (res) {
				data = res.data;
				console.log(data)
				if (data.code == 200) {
					_this.facultyList = data.data;
				} else {
					layer.alert(data.message);
				}
			}).catch(function (error) {
			});
		},
		save: function() {
			let saveDataJson = app.modelData;
			/*
			* 回填院系与专业名称
			*/
			let facultyGuid = app.modelData.facultyGuid;
			if (facultyGuid != '' && facultyGuid != null) {
				let facultyList = app.facultyList;
				for (var i = 0, len = facultyList.length; i < len; i++) {
					if (facultyList[i].id == facultyGuid) {
						saveDataJson.facultyName = facultyList[i].name;
						let majorList = facultyList[i].dtos;
						let majorGuid = app.modelData.majorGuid;
						for (var j = 0, lenJ = majorList.length; j < lenJ; j++) {
							if (majorList[j].id == majorGuid) {
								saveDataJson.majorName = majorList[j].name;
							}
						}
					}
				}
			}
			axios.post(URLS.API_URLS.SAVE, saveDataJson)
			.then(function (res) {
				data = res.data;
				if (data.code == 200) {
					layer.alert('注册成功', function(i) {
						layer.close(i);
						window.location.href = '/recommend';
					})
				} else {
					layer.alert(data.message);
				}
			}).catch(function (error) {
			});
		},
		cancel: function() {
			window.location.href = '/recommend';
		}
	},
	mounted: function() {
		this.init();
	},
	computed: {
		majorList: function() {
			let _this = this;
			let facultyGuid = _this.modelData.facultyGuid;
			if (facultyGuid == '' || facultyGuid == null) {
				return [];
			}
			let facultyList = _this.facultyList;
			for (var i = 0, len = facultyList.length; i < len; i++) {
				if (facultyList[i].id == facultyGuid) {
					return facultyList[i].dtos;
				}
			}
		}
	}
});
</script>
</html>